<template>
    <el-menu
            default-active="2"
            class="el-menu-vertical-demo"
            @open="handleOpen"
            @close="handleClose"
            background-color="#545c64"
            text-color="#fff"
            active-text-color="#ffd04b">
        <router-link to="/index">
        <el-menu-item index="0">
            <template slot="title">
                <i class="el-icon-s-home"></i>
                <span>首页</span>
            </template>
        </el-menu-item>
        </router-link>

        <el-submenu index="/sys/manager">
            <template slot="title">
                <i class="el-icon-s-operation"></i>
                <span>系统管理</span>
            </template>

            <router-link to="/sys/user">
            <el-menu-item index="1-1">
                <template slot="title">
                    <i class="el-icon-s-customer"></i>
                    <span>用户管理</span>
                </template>
            </el-menu-item>
            </router-link>

            <router-link to="/sys/role">
            <el-menu-item index="1-2">
                <template slot="title">
                    <i class="el-icon-s-rank"></i>
                    <span>角色管理</span>
                </template>
            </el-menu-item>
            </router-link>

            <router-link to="/sys/menu">
            <el-menu-item index="1-3">
                <template slot="title">
                    <i class="el-icon-s-menu"></i>
                    <span>菜单管理</span>
                </template>
            </el-menu-item>
            </router-link>

        </el-submenu>

        <el-submenu index="1">
            <template slot="title">
                <i class="el-icon-s-tools"></i>
                <span>系统工具</span>
            </template>

            <router-link to="/number">
            <el-menu-item index="1-1">
                <template slot="title">
                    <i class="el-icon-s-order"></i>
                    <span>数字字典</span>
                </template>
            </el-menu-item>
            </router-link>
        </el-submenu>

    </el-menu>
</template>

<script>
    import store from "../../store";

    export default {
        name: "SideMenu",

        //动态监控 menusList 的变化
        // computed:{
        //     menusList: {
        //         get(){
        //             return this.$store.menuList
        //         }
        //     }
        //
        // },
        methods: {
            handleOpen(){

            },
            handleClose(){
                console.log("close 给给  官方")
            }
        },

        created() {
            // alert("是这里 res:" + "\n" + this.$store.menuList)
            this.menusList = this.$store.menuList
        },
        data(){
            return{

                menusList:this.$store.menuList
                //     [
                //     {
                //         title:'系统管理',
                //         name:'SysManger',
                //         icon:'el-icon-s-operation',
                //         path:'',
                //         children:[
                //             {
                //                 title:'用户管理',
                //                 name:'SysUser',
                //                 icon:'el-icon-s-customer',
                //                 path:'/sys/user',
                //                 children:[]
                //             },
                //             {
                //                 title:'角色管理',
                //                 name:'SysRole',
                //                 icon:'el-icon-s-role',
                //                 path:'/sys/role',
                //                 children:[]
                //             }
                //         ]
                //     },{
                //         title:'系统工具',
                //         name:'SysTool',
                //         icon:'el-icon-s-tools',
                //         path:'',
                //         children:[
                //             {
                //                 title:'数字字典',
                //                 name:'SysUser',
                //                 icon:'el-icon-s-order',
                //                 path:'/sys/dict',
                //                 children:[]
                //             }
                //             ]
                //     }]


            }
        }
    }
</script>

<style scoped>
    a{
        /*去掉下划线*/
        text-decoration: none;
    }
</style>